type Props = {
    className?: string;
    children?: React.ReactNode;
    size?: "small" | "medium" | "large";
};

const Button: React.FC<Props> = (
    { size, className, children } = { size: "medium" }
) => {
    return (
        <button
            className={`${size} relative h-8 leading-6 py-1 shrink-0 w-fit m-1 *:h-full [&.small]:px-2 [&.small]:h-6 [&.small]:leading-4 [&:not(.small)]:px-8 text-nowrap leading-1 bg-blue text-white text-sm rounded text-center cursor-pointer hover:brightness-125 ${className} after:absolute after:-top-1 after:-left-1 after:-right-1 after:-bottom-1 after:bg-opacity-10 after:bg-blue after:rounded-md`}
        >
            {children ?? "按钮"}
        </button>
    );
};

export default Button;
